<template>
	<view class="sutmit-order-page">
		<cu-custom bgColor="bg-E96141" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">提交订单</block>
		</cu-custom>
		
		<!-- 消费清单/服务项目 -->
		<view class="buy-item-con"
			v-if="orderType=='1' && serviceItemEn">
			<view class="service-item-con">
				<view class="cover-img-con">
					<image class="cover-img" :src="serviceItemEn.coverImage" mode="widthFix"></image>
				</view>
				<view class="text-con">
					<view class="title">{{serviceItemEn.title}}</view>
					<view class="price">{{serviceItemEn.ylbprice}}</view>
					<view class="desc">{{serviceItemEn.description}}</view>
				</view>
			</view>
		</view>
		
		<!-- 疫苗结算清单 -->
		<view class="buy-item-con"
			v-if="orderType=='4' && title">
			<view class="service-item-con">
				<view class="cover-img-con">
					<image class="cover-img" :src="serviceItemEn.coverImage" mode="widthFix"></image>
				</view>
				<view class="text-con">
					<view class="title">{{title}}价格:￥{{ymprice}}</view>
					
				</view>
			</view>
		</view>
		
		<!-- 视频结算清单 -->
		<view class="buy-item-con"
			v-if="orderType=='5' && title">
			<view class="service-item-con">
				<view class="cover-img-con">
					<image class="cover-img" :src="serviceItemEn.coverImage" mode="widthFix"></image>
				</view>
				<view class="text-con">
					<view class="title">{{title}}价格:￥{{ylbprice}}</view>
					
				</view>
			</view>
		</view>
		
		
		
		<!-- 服务项目/付款金额 -->
		<view class="money-con"
			v-if="orderType=='1' && serviceItemEn">
			<text class="title">合计付款金额</text>
			<text class="price">{{shouldPayTotalMoney}}</text>
		</view>
		
		<!-- 消费清单/检测项目 -->
		<view class="buy-item-con"
			v-if="orderType=='2' && checkItemList && checkItemList.length>0">
			<view class="service-item-con"
				v-for="(item, index) in checkItemList" :key="item.id">
				<view class="cover-img-con">
					<image class="cover-img" :src="item.coverImg?item.coverImg:ciDefaultCoverImg" mode="widthFix"></image>
				</view>
				<view class="text-con">
					<view class="title">{{item.checkname}}</view>
					<view class="price">{{item.ylbprice}}</view>
					<view class="remove-item" @tap="deleteCheckItem(item)">删除</view>
				</view>
			</view>
		</view>
		<!-- 检测项目/付款金额 -->
		<view class="money-con"
			v-if="orderType=='2' && checkItemList && checkItemList.length>0">
			<text class="title">合计付款金额</text>
			<text class="price">{{shouldPayTotalMoney}}</text>
		</view>
		
		<!-- 疫苗 优惠信息 -->
		<view class="money-con"
			v-if="orderType=='4' && yimiaoyh">
		<!-- 	<text class="title">合计付款金额</text> -->
			<text class="price1">{{yimiaoyh}}</text>		
		</view>
		
		<view class="money-con"
			v-if="orderType=='4' && zliaoPrice">
		<!-- 	<text class="title">合计付款金额</text> -->
			
			<text class="price1">上门诊疗服务费：{{zliaoPrice}}</text>
			
		</view>
		
		<!-- 疫苗/付款金额 -->
		<view class="money-con"
			v-if="orderType=='4' && title && ymprice">
			<text class="title">合计付款金额</text>
			<text class="price">{{Number(ymprice) + Number(zliaoPrice)}}</text>
		</view>
		
		<!-- 视频问诊/付款金额 -->
		<view class="money-con"
			v-if="orderType=='5' && title && ylbprice">
			<text class="title">合计付款金额</text>
			<text class="price">{{Number(ylbprice)}}</text>
		</view>
		
		<!-- 药品清单 -->
		<view class="buy-item-con"
			v-if="orderType=='3' && yaopingList && yaopingList.length>0">
			<view class="service-item-con"
				v-for="(item, index) in yaopingList" :key="item.id">
				<view class="cover-img-con">
					<image class="cover-img" :src="item.imageUrl?item.imageUrl:yaopingImg" mode="widthFix"></image>
				</view>
				<view class="text-con">
					<view class="title">{{item.title}}</view>
					<view class="price1">￥{{item.ylbprice}}</view>
					<view class="remove-item" >数量：{{item.productCount}}</view>
				</view>
			</view>
		</view>
		<!-- 优惠信息 -->
		<view class="money-con"
			v-if="orderType=='3' && yaopingList && yaopingList.length>0">
		<!-- 	<text class="title">合计付款金额</text> -->
			<text class="price1">{{youhui}}</text>		
		</view>
		<view class="money-con"
			v-if="orderType=='3' && yaopingList && yaopingList.length>0">
		<!-- 	<text class="title">合计付款金额</text> -->
			
			<text class="price1">原价：{{yuanjia}}</text>
			
		</view>
		<!-- 药品清单结算 -->
		<view class="money-con"
			v-if="orderType=='3' && yaopingList && yaopingList.length>0">
			<text class="title">优惠后付款金额</text>
			<text class="price">{{shouldPayTotalMoney}}</text>
		</view>
		
		
		
		<!-- 支付类型 -->
		<view class="pay-type-con">
			<view class="con-title">付款方式</view>
			<view :class="payType=='0'?'oper-btn-active':'oper-btn'" @tap="changePayType('0')">
				<image class="icon" src="https://ylb123.oss-cn-hangzhou.aliyuncs.com/app/pay-style-wx.png" mode=""></image>
				<text class="title">微信</text>
				<image v-if="payType=='0'" class="icon-jiao-active" src="https://ylb123.oss-cn-hangzhou.aliyuncs.com/app/icon-32-dui-hao.png" mode=""></image>
			</view>
			<view :class="payType=='1'?'oper-btn-active':'oper-btn'" @tap="changePayType('1')">
				<image class="icon" src="https://ylb123.oss-cn-hangzhou.aliyuncs.com/app/pay-style-zfb.png" mode=""></image>
				<text class="title">支付宝</text>
				<image v-if="payType=='1'" class="icon-jiao-active" src="https://ylb123.oss-cn-hangzhou.aliyuncs.com/app/icon-32-dui-hao.png" mode=""></image>
			</view>
		</view>
		
		<!-- 操作按钮 -->
		<view class="btn-oper-con">
			<button class="cu-btn bg-cyan lg btn-oper"
				style=" margin-bottom: 30upx;" 
				@tap="cancelSubmit()">取消下单</button>
				
			<button class="cu-btn line-orange lg btn-oper"
				style="background-color: #E96141; color: #ffffff;"
				@tap="submitPay()">下单付款</button>
		</view>
	</view>
</template>

<script>
	
	export default {
		name: "submitOrder",
		data() {
			return {
				/*订单类型
					0-会员充值
					1-会员按次预约服务项目
					2-会员按次预约检测项目
				*/
				orderType: '',
				pageDataList: [],
				youhui: '',
				yuanjia: 0,
				title:'',
				ymprice:'',
				//服务项目
				serviceItemId: '',
				serviceItemEn: {
					id: '',
					title: '',
					coverImage: '',
					description: '',
					price: '0.00',
					ylbprice: '0.00'
				},
				
				//检测项目
				ciDefaultCoverImg: 'https://ylb123.oss-cn-hangzhou.aliyuncs.com/app/check-item-v2-noimage.jpg',
				checkItemIdsStr: '',
				checkItemList: [],
				
				//药品结算
				yaopingImg: 'https://ylb123.oss-cn-hangzhou.aliyuncs.com/app/check-item-v2-noimage.jpg',
				yaopingStr: '',
				yaopingList: [],
				drugids: '',
				shouldPayTotalMoney: '0.00',
				payType: '0', 			//付款方式(0-微信, 1-支付宝)
				
				//疫苗优惠
				yimiaoyh:'',
				zliaoPrice:'',
				ymprice:'',
			};
		},
		onLoad: function (option) {
			this.orderType = option.orderType?option.orderType:''
		
			this.serviceItemId = option.serviceItemId?option.serviceItemId:''
			this.checkItemIdsStr = option.ciIds?option.ciIds:''
			if(this.orderType!=1&this.orderType!=2&this.orderType!=4&this.orderType!=5){
				this.orderType=3
			}
		
			
			if(this.orderType==4){
				this.title=option.title
				this.ymprice=option.price
				this.yimiaoyh=option.remark
				this.zliaoPrice=option.ylbPrice
			}
			
			if(this.orderType==5){
				this.title=option.title
				this.ylbprice=option.price				
				this.zliaoPrice=option.ylbPrice
			
					
			}
		
			
			if(this.orderType==3){
				let obj = option.str.replace("\"([^\"]*)\"", "$1");				
				this.pageDataList = JSON.parse(obj);
			}
		
			
			//1-会员按次预约服务项目
			if(this.orderType=='1' && this.serviceItemId){
				this.loadServiceItemDetail()
			}
			
			//2-会员按次预约检测项目
			if(this.orderType=='2' && this.checkItemIdsStr){
				this.loadCheckItems()
			}
			//3 药品结算
			if(this.orderType=='3' && this.checkItemIdsStr){
				this.loadCheckItems3()
			}
			this.getorders()
		},
		computed: {
		},
		methods: {
			//向后台提交购物车数据 获取结算数据
			getorders(){
				let params=''
				for(let i=0;i<this.pageDataList.length;i++){
					let idx=this.pageDataList[i].id
					let numx=this.pageDataList[i].num
					params=params + idx +'@' +numx+','				
				}
				this.drugids = params
				let _params = {
					ids: params,
					drugids:params
					
				}
				let that = this
				
				that.$http.post("/drug/drugproduct/queryByIds", _params).then(res=>{
					if(res.data.success){
						// console.log(res)
						that.yaopingList=res.data.result
						
						if(that.orderType===3){
							that.shouldPayTotalMoney=that.yaopingList[0].total
							that.youhui=that.yaopingList[0].jsonObj
							that.yuanjia=that.yaopingList[0].yuanjiaPrice
						}
						
					}
				})
			},
			//服务项目-加载
			loadServiceItemDetail(){
				uni.showLoading({
					title:'加载中...',
					mask:true
				})
				let _params = {
					id: this.serviceItemId
				}
				let that = this
				that.$http.get("/prodservicev2/prodservicev2/queryById",{params:_params}).then(res=>{
					if(res.data.success){
						uni.hideLoading()
						/*服务项目
							{
								coverImage: "https://ylb123.oss-cn-hangzhou.aliyuncs.com/app/service-item-v2-skhy-d.jpg"
								description: "包括病情评估，雾化吸入操作，排痰方法指导，雾化装置维护方法指导等服务"
								id: "1485147980434055170"
								price: "150"
								title: "伤口换药(大)"
								ylbprice: "150"
							}
						*/
						that.serviceItemEn = res.data.result
						that.shouldPayTotalMoney = that.serviceItemEn.ylbprice
					}else{
						uni.hideLoading()
					}
				}).catch(err => {
					uni.hideLoading()
				});
			},
			//药品项目加载
			loadCheckItems3(){
				uni.showLoading({
					title:'加载中...',
					mask:true
				})
				let _params = {
					ids: this.checkItemIdsStr
				}
				let that = this
				that.$http.post("/drug/drugproduct/queryByIds", _params).then(res=>{
					if(res.data.success){
						uni.hideLoading()
						/*服务项目
							{
								checkname: "TP53肿瘤易感基因检测"
								id: "1485254525469679617"
								total: "1560"		//会员本批次消费的总金额
								ylbprice: "400"
							}
						*/
					   console.log(res)
						that.yaopingList = res.data.result
						if(that.yaopingList && that.yaopingList.length>0){
							that.shouldPayTotalMoney = that.yaopingList[0].total
						}else{
							//会员删除了所有“检测项目”
							that.$tip.cyToast('您已删除全部检测项目')
							setTimeout(function() {
								uni.navigateBack({
									delta: 1
								})
							}, 500);
						}
					}else{
						uni.hideLoading()
					}
				}).catch(err => {
					uni.hideLoading()
				});
			},
			//检测项目-加载
			loadCheckItems(){
				uni.showLoading({
					title:'加载中...',
					mask:true
				})
				let _params = {
					ids: this.checkItemIdsStr
				}
				let that = this
				that.$http.post("/checkprojectson/check/queryByIds", _params).then(res=>{
					if(res.data.success){
						uni.hideLoading()
						/*服务项目
							{
								checkname: "TP53肿瘤易感基因检测"
								id: "1485254525469679617"
								total: "1560"		//会员本批次消费的总金额
								ylbprice: "400"
							}
						*/
						that.checkItemList = res.data.result
						if(that.checkItemList && that.checkItemList.length>0){
							that.shouldPayTotalMoney = that.checkItemList[0].total
						}else{
							//会员删除了所有“检测项目”
							that.$tip.cyToast('您已删除全部检测项目')
							setTimeout(function() {
								uni.navigateBack({
									delta: 1
								})
							}, 500);
						}
					}else{
						uni.hideLoading()
					}
				}).catch(err => {
					uni.hideLoading()
				});
			},
			//检测项目-删除
			deleteCheckItem(item){
				if(!item || !item.id){
					this.$tip.cyToast('检测项目参数错误')
					return false
				}
				let that = this
				uni.showModal({
					title: '温馨提醒',
					content: '确定要删除?',
					confirmText: '删除',
					cancelText: '取消',
					success: (res) => {
						if (res.confirm) {
							//点击-确定
							let removeId = item.id
							let ciItem = {}
							let _checkItemIdsStr = ''
							for(let i=0;i<that.checkItemList.length;i++){
								ciItem = that.checkItemList[i]
								if(removeId!=ciItem.id){
									_checkItemIdsStr += ciItem.id + ','
								}
							}
							that.checkItemIdsStr = _checkItemIdsStr
							that.loadCheckItems()
						}else{
							//点击-取消
						}
					}
				})
			},
			//取消下单
			cancelSubmit(){
				uni.navigateBack({
					delta: 1
				})
			},
			//切换支付方式
			changePayType(type) {
				if (type == this.payType) {
					//选择了本身, 表示取消重新选择
					this.payType = ''
					return false
				}
				this.payType = type
			},
			//下单付款
			submitPay() {
				let that = this
				/*订单类型
					0-会员充值
					1-会员按次预约服务项目
					2-会员按次预约检测项目
				*/
				let _params = {}
				if(that.orderType==1){
					//1-会员按次预约服务项目
					if (!that.serviceItemEn.id) {
						that.$tip.cyToast('服务项目不存在或已下架')
						return false;
					}
					_params = {
						orderType: '1',
						serviceItemId: that.serviceItemEn.id
					}
				}else if(that.orderType==2){
					//2-会员按次预约检测项目
					_params = {
						orderType: '2',
						serviceItemId: that.checkItemIdsStr		//TODO 此字段与后台还未对接
					}
				}
				else if(that.orderType==3){
					//2-会员按次预约检测项目
					_params = {
						orderType: '3',
						serviceItemId: that.drugids		
					}
				}else if(that.orderType==4){
					_params = {
						orderType: '4',
						orderAmount: Number(that.ymprice) + Number(that.zliaoPrice) 		
					}
					
				}else if(that.orderType==5){
					_params = {
						orderType: '5',
						orderAmount: Number(that.ylbprice)		
					}
				}
				
				if (that.payType == '') {
					that.$tip.cyToast('请选择付款方式')
					return false;
				}
				
				//向本平台提交订单信息
				/*
				创建订单向后台传参:
					orderType: 订单类型(0-会员充值场景, 1-会员按次消费服务项目)
					payType: 支付方式(0-微信, 1-支付宝)
						orderType=0时, 额外回传[vipLevelId: 会员类型ID]
						orderType=1时, 额外回传[serviceItemId: 服务项目ID]
						orderType=2时, 额外回传[checkItemIds: 所选检测项目ID(如:1001,1002,1003,)]
				*/
				_params.payType = that.payType
				uni.showLoading({
					title: '下单中...',
					mask: true,
				})
				that.$http.post("/orderinfo/orders/add", _params).then(res=>{
					if(res.data.success){
						uni.hideLoading()
						let serverJsonData = res.data.result
						if(!serverJsonData){
							that.$tip.toast('下单失败,刷新重试或联系客服处理')
							return false
						}
						if (that.payType == '0') {
							//微信付款
							that.useWeiXinPay(serverJsonData)
						} else if (that.payType == '1') {
							//支付宝付款
							that.useZhiFuBaoPay(serverJsonData)
						} else {
						}
					}else{
						uni.hideLoading()
						that.$tip.toast(res.data.message);	
					}
				}).catch(err => {
					uni.hideLoading()
				});
			},
			
			//微信付款
			useWeiXinPay(serverJsonData) {
				if(!serverJsonData){
					this.$tip.toast('订单异常,请联系客服处理')
					return false
				}
				let _orderInfo = serverJsonData.orderInfo
				uni.showLoading({
					title: '交易处理中...',
					mask: true,
				})
				let that = this
				uni.requestPayment({
					provider: 'wxpay',
					orderInfo: _orderInfo, //订单数据
					complete: function(res){
						/*微信-付款后，返回值结构
						{
							"channel": {
								"id": "wxpay",
								"description": "微信",
								"serviceReady": true
							},
							"rawdata": "{\"_wxapi_baseresp_transaction\":\"null\",\"_wxapi_payresp_extdata\":\"null\",\"_wxapi_command_type\":\"5\",\"_wxapi_baseresp_errcode\":\"0\",\"_wxapi_baseresp_errstr\":\"null\",\"_wxapi_baseresp_openId\":\"null\",\"_wxapi_payresp_returnkey\":\"\",\"_wxapi_payresp_prepayid\":\"wx1515247182706230d4cdfde2255490000\"}",
							"errMsg": "requestPayment:ok"
						}
						*/
						uni.hideLoading()
						let commonErrorTip = '付款失败'
						if(!res){
							that.$tip.toast(commonErrorTip)
							return false
						}
						if(!res.rawdata){
							that.$tip.toast(commonErrorTip)
							return false
						}
						let _wxAppPay = res.rawdata
						
						//将JSON字符串转为JSON对象
						_wxAppPay = JSON.parse(_wxAppPay)
						
						//判定支付成功或失败
						let _errMsg = res.errMsg.toLowerCase().trim()
						let _wxapi_baseresp_errcode = _wxAppPay._wxapi_baseresp_errcode.toLowerCase().trim()
						let _wxapi_baseresp_errstr = _wxAppPay._wxapi_baseresp_errstr.toLowerCase().trim()
						/* console.log('_errMsg = ', _errMsg)
						console.log('_wxapi_baseresp_errcode = ', _wxapi_baseresp_errcode)
						console.log('_wxapi_baseresp_errstr = ', _wxapi_baseresp_errstr) */
						if(_errMsg=='requestpayment:ok' && _wxapi_baseresp_errcode=='0' && _wxapi_baseresp_errstr=='null'){
							that.vipLevelId = ''
							that.money = '0.00'
							that.$tip.success('充值成功')
							setTimeout(function() {
								uni.navigateBack({
									delta: 1
								})
							}, 500);
						}else{
							that.$tip.toast(commonErrorTip)
						}
					}
				});
			},
			
			//支付宝付款
			useZhiFuBaoPay(serverJsonData) {
				if(!serverJsonData){
					this.$tip.toast('订单异常,请联系客服处理')
					return false
				}
				
				let _orderInfo = serverJsonData.orderInfo
				uni.showLoading({
					title: '交易处理中...',
					mask: true,
				})
				let that = this
				uni.requestPayment({
					provider: 'alipay',
					orderInfo: _orderInfo, //订单数据
					complete: function(res){
						/*支付宝-付款后，返回值结构
						{
							"channel": {
								"id": "alipay",
								"description": "支付宝",
								"serviceReady": true
							},
							"description": "",
							"rawdata": "{\"resultStatus\":\"9000\",\"memo\":\"\",\"result\":\"{\\\"alipay_trade_app_pay_response\\\":{\\\"code\\\":\\\"10000\\\",\\\"msg\\\":\\\"Success\\\",\\\"app_id\\\":\\\"2021003112633772\\\",\\\"auth_app_id\\\":\\\"2021003112633772\\\",\\\"charset\\\":\\\"UTF-8\\\",\\\"timestamp\\\":\\\"2022-01-13 08:58:09\\\",\\\"out_trade_no\\\":\\\"2022011308520492641599645909\\\",\\\"total_amount\\\":\\\"0.02\\\",\\\"trade_no\\\":\\\"2022011322001448431400722416\\\",\\\"seller_id\\\":\\\"2088512496097221\\\"},\\\"sign\\\":\\\"dscyx0BFKuZ0FTaAmpf+qj1kJob7JP4Nz43qAPrInGVJf0KcTzL7I2w\\/PSEBvUr37ELcD21ldeV073RUV+EOLC3Sp3goNVpQ6fXmZ8z085TyGAOdkRm6XkMsajTuCxY7QQVWuDafFEy6qnYmPUcJKTYLPkuWzrQ54L0WPbF2jR2CUTBFhzk6MmDfsjhJayMk7oG4nDFOOkp5RMpFTwtwrCR8XXtP9TxGFXMmWqfUHTYfchQVid6\\/MCdKDedn00y5OjZ2MdwfxnsmjEnTTvd+94Ci7dKSoXsA2kXxwKoGYw6Dfpa7XWxM0dzFzasDy2KxHecY0J1F2m6eNcHZTFJBqw==\\\",\\\"sign_type\\\":\\\"RSA2\\\"}};extendInfo={{\\\"doNotExit\\\":true,\\\"isDisplayResult\\\":true,\\\"tradeNo\\\":\\\"2022011322001448431400722416\\\"}\"}",
							"errMsg": "requestPayment:ok"
						}
						*/
						uni.hideLoading()
						let commonErrorTip = '付款失败'
						if(!res){
							that.$tip.toast(commonErrorTip)
							return false
						}
						if(!res.rawdata){
							that.$tip.toast(commonErrorTip)
							return false
						}
						let _rawdata = res.rawdata
						
						//定位到alipay_trade_app_pay_response位置
						let _aliAppPay = _rawdata.substring(_rawdata.indexOf('alipay_trade_app_pay_response'))
						
						//取alipay_trade_app_pay_response后的{}内键值对
						_aliAppPay = _aliAppPay.substring(_aliAppPay.indexOf('{'), _aliAppPay.indexOf('}')+1)
						
						//将字符串进行正则表达式替换，将所有的[\"]替换成["]
						_aliAppPay = _aliAppPay.replace(/\\\"/g, "\"")
						
						//将JSON字符串转为JSON对象
						_aliAppPay = JSON.parse(_aliAppPay)
						
						//判定支付成功或失败
						let _errMsg = res.errMsg.toLowerCase().trim()
						let _code = _aliAppPay.code.toLowerCase().trim()
						let _msg = _aliAppPay.msg.toLowerCase().trim()
						
						if(_errMsg=='requestpayment:ok' && _code=='10000' && _msg=='success'){
							that.vipLevelId = ''
							that.money = '0.00'
							that.$tip.success('充值成功')
							setTimeout(function() {
								uni.navigateBack({
									delta: 1
								})
							}, 500);
						}else{
							that.$tip.toast(commonErrorTip)
						}
					}
				});
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	
	.sutmit-order-page{
		
	}
	
	/* 购买信息 */
	.buy-item-con{
		margin: 20upx;
		padding-bottom: 20upx;
		background-color: #ffffff;
		border-radius: 10upx;
		.service-item-con{
			display:flex;
			with: 100%;
			border-bottom: 1px dashed #ececec;
			padding: 20upx;
			height: auto;
			overflow: hidden;
			.cover-img-con{
				flex:1;
				image{
					width: 140upx;
					height: 70upx;
					border-radius: 10upx;
				}
			}
			&:last-child{
				border-bottom: 0;
				margin-bottom: 0;
				padding-bottom: 0;
			}
			.text-con{
				flex:4;
				margin-left: 16upx;
				font-size: 26upx;
				color: #999999;
				overflow: hidden;
				.title{
					text-overflow: ellipsis;
					white-space: nowrap;
					overflow: hidden;
					font-size: 36upx;
					color: #666666;
					margin-bottom: 10upx;
				}
				.price{
					color: $uni-color-dc4c47;
					line-height: 36upx;
					font-size: 36upx;
					font-weight: bold;
					margin-bottom: 10upx;
					&:before{
						content: '￥';
						font-size: 20upx;
					}
					&:after{
						content: ' / 次';
						font-size: 20upx;
					}
					
				}
				.price1{
					color: $uni-color-dc4c47;
					line-height: 36upx;
					font-size: 36upx;
					font-weight: bold;
					margin-bottom: 10upx;
					font-size: 20upx;
				}
				.desc{
					margin-bottom: 20upx;
				}
				.remove-item{
					float: right;
					font-size: 32upx;
					color: #1CBBB4;
				}
			}
		}
	}
	
	/* 应付金额 */
	.money-con{
		background-color: #ffffff;
		height: auto;
		overflow: hidden;
		margin: 20upx;
		padding: 20upx;
		border-radius: 10upx;
		.title{
			font-size:24upx; 
			color:#646464;
		}
		.price{
			float: right;
			color: $uni-color-dc4c47;
			line-height: 36upx;
			font-size: 36upx;
			font-weight: bold;
			&:before{
				content: '￥';
				font-size: 20upx;
			}
		}
	}
	
	/* 付款方式 */
	.pay-type-con{
		background-color: #ffffff;
		height: auto;
		overflow: hidden;
		margin: 20upx;
		padding: 20upx;
		border-radius: 10upx;
		.con-title{
			font-size:24upx; 
			color:#646464;
			margin-bottom: 20upx;
		}
		.oper-btn{
			float: left;
			width: 220upx;
			overflow: hidden;
			margin-right: 40upx;
			padding: 15upx 0;
			border: 1px solid #eaeaea;
			border-radius: 15upx;
			.icon{
				width: 32px;
				height: 32px;
				margin: 0 15upx;
			}
			.title{
				font-size: 32upx;
				position: relative;
				top: -20upx;
			}
		}
		.oper-btn-active{
			float: left;
			width: 220upx;
			overflow: hidden;
			margin-right: 40upx;
			padding: 15upx 0;
			border: 1px solid #EA6040;
			border-radius: 15upx;
			position: relative;
			.icon{
				width: 32px;
				height: 32px;
				margin: 0 15upx;
			}
			.icon-jiao-active{
				width: 24px;
				height: 24px;
				position: absolute;
				top: 0;
				right: 0;
			}
			.title{
				font-size: 32upx;
				position: relative;
				top: -20upx;
				color: #EA6040;
				font-weight: bold;
			}
		}
	}
	
	/* 操作按钮 */
	.btn-oper-con{
		margin: 50upx 20upx 20upx 20upx;
		text-align: right;
		.btn-oper{
			margin-left: 30upx;
		}
	}
	
</style>
